@import "../mixin.scss";

@include namespace(upload) {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    display: inline-block;
    text-align: center;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;

    &:hover {
        border-color: #409eff;
    }

    &__input {
        display: none;
    }

    &-preview {
        list-style: none;
        margin: 0;
        padding: 0;

        >li {
            position: relative;
            display: inline-block;

            &:hover {
                .operator {
                    z-index: 2;
                }
            }

            .operator {
                position: absolute;
                left: 50%;
                transform: translateX(-50%);
                top: 10%;
                color: #fff;
                cursor: pointer;
                z-index: -1;
                background-color: rgba(0,0,0,0.5);
                white-space: nowrap;
            }

            >img {
                width: 120px;
                height: 120px;
            }
        }
    }
}